<template>
  <div class="xiecheng">
    <div class="admin_main_block">
      <div class="admin_main_block_top">
        <div class="admin_main_block_left">
          <div>{{ i18n('question.paper.view') }}</div>
        </div>

        <div class="admin_main_block_right">
          <div class="mr10">
            <el-button icon="Back" @click="router.go(-1)">
              {{ i18n('common.return') }}
            </el-button>
          </div>
        </div>
      </div>

      <div class="admin_form_main">
        <el-card class="box-card" shadow="never">
          <template v-slot:header>
            <div class="clearfix">
              <el-row>
                <el-col :span="23">
                  <b>{{ dataForm.title }}</b>
                </el-col>
                <el-col class="el-text-green" :span="1">
                  <b>{{ dataForm.test_time }} {{ i18n('common.minute') }}</b>
                </el-col>
              </el-row>
            </div>
          </template>
          <div class="text item">
            <el-descriptions direction="vertical" :column="1" border>
              <el-descriptions-item :label="item.title" label-align="left" v-for="(item, key) in dataForm.data" :key="key">
                <div v-html="item.content"></div>
              </el-descriptions-item>
            </el-descriptions>
          </div>
        </el-card>
      </div>
    </div>
  </div>
</template>

<script setup name="paper-view">
  import { useBase } from "@/hooks/base/useBase"
  import { useForm } from "@/hooks/form/useForm"

  const { router, query, i18n, isAuth } = useBase()

  const model = ref('education/paper/question')

  const dataForm = reactive({
    title: '',
    test_time: '',
    data: []
  })

  const init = () => {
    if (query.id) {
      $http({
        url: $http.adornUrl(`/${model.value}/select`),
        method: 'get',
        params: $http.adornParams({
          paper_id: query.id
        }),
      }).then(({ data }) => {
        if (data && data.status === 200) {
          dataForm.data = data.data
        }
      }).then(() => {
        if (query.id) {
          $http({
            url: $http.adornUrl(`/education/paper/view/${query.id}`),
            method: 'get',
            params: $http.adornParams({}),
          }).then(({ data }) => {
            if (data && data.status === 200) {
              dataForm.title = data.data.title
              dataForm.test_time = data.data.test_time
            }
          })
        }
      })
    }
  }

  onMounted(() => {
    init()
  })
</script>
